<template>
  <div class="main status-container">
    <section>
      <div class="tax-status">
        全国电子票据开关状态：
        <span class="blue" v-if="isSwitch === 'true'">开启</span>
        <span class="red" v-else>关闭</span>
      </div>
      <div style="padding: 20px 0;">
        <el-button type="primary" v-if="isSwitch === 'false'" @click="handleSwitch(1)">开启</el-button>
        <el-button v-else @click="handleSwitch(2)">关闭</el-button>
      </div>
       <el-table v-loading="listLoading" :data="list" element-loading-text="给我一点时间" border fit highlight-current-row>
          <el-table-column align="center" label="序号" type="index" fixed :index="(index)=>{return indexMethod(index, listQuery)}" width="80"></el-table-column>
          <el-table-column align="center" label="操作状态" prop="value" min-width="130">
            <template slot-scope="scope">
              {{scope.row.value === 'true' ? '开启':'关闭'}}
            </template>
          </el-table-column>
          <el-table-column align="center" label="修改人" prop="updateOperator" min-width="160"></el-table-column>
          <el-table-column align="center" label="修改时间" prop="updateAt" min-width="160"></el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="listQuery.pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="listQuery.pageSize"
        background
        layout="total, sizes, prev, pager, next, jumper"
        :total="listTotal"
      >
      </el-pagination>
    </section>
  </div>
</template>
<script>
export default {
  data() {
    return {
      list: [],
      listLoading: false,
      isSwitch: false,
      listTotal: 0,
      listQuery: {
        "invoiceSettingEnum": "INVOICE_SWITCH",
        "pageNum": 1,
        "pageSize": 10
      }
    }
  },
  mounted(){
    this.getSwitch()
    this.getLogList()
  },
  methods: {
    getLogList() {
      this.request({
        url: `/invoice-web-manage//invoice/setting/log`,
        method: "post",
        data: this.listQuery
      }).then(res => {
        this.list = res.data.list
          this.listLoading = false
          this.listTotal = res.data.total
      }).catch(e => {
        console.log(e)
        this.list = []
        this.listLoading = false
      })
    },
    getSwitch(){
      this.request({
        url: `/invoice-web-manage/invoice/setting/getSwitch`,
        method: "post",
      }).then(res => {
        console.log(res)
        this.isSwitch = res.data
      }).catch(err => {
        console.log(err)
      });
    },
    handleSwitch(type){
      let value = false
      let txt = ''
      if (type === 1){
        value = 'true'
        txt = '开启'
      } else if (type === 2){
        value = 'false'
        txt = '关闭'
      }
      this.$confirm(`是否确认${txt}？`).then(res => {
        this.request({
          url: `/invoice-web-manage/invoice/setting/save`,
          method: "post",
          data: {
            "invoiceSetting": "INVOICE_SWITCH",
            "operator":this.$store.getters.user.realname,
            "value": value
          }
        }).then(res => {
          this.isSwitch = value
          this.handleCurrentChange(1)
          console.log(res)
        }).catch(err => {
          console.log(err)
        });
      }).catch((e) => {console.log(e)})
    },
    // 切换分页
    handleCurrentChange(page) {
      this.listQuery.pageNum = page
      this.getLogList()
    },
    // 切换分页数
    handleSizeChange(pageSize) {
      this.listQuery.pageSize = pageSize
      this.getLogList()
    }
  }
}
</script>
<style scoped lang="scss">
.tax-status {
  font-size: 18px;
  .blue {
    color: #409EFF;
  }
  .red {
    color: red;
  }
}
</style>
